<template>
  <el-dialog :title="$t('table.detail')" width="700px" :visible="true" @close="onClose">
    <el-form :model="form" label-width="70px" size="small">
      <el-form-item :label="$t('genCode.tableName')">
        <el-input v-model="form.tableName" readonly></el-input>
      </el-form-item>
      <el-form-item :label="$t('genCode.remarks')">
        <el-input v-model="form.remarks" readonly></el-input>
      </el-form-item>
      <el-form-item :label="$t('genCode.columns')">
        <!--<el-tag v-for="(item, index) in form.columns" :key="item.columnName" style="margin-left: 5px;">{{item.columnName}}:{{item.columnClassName}}</el-tag>-->
        <el-table
          :data="form.columns"
          style="width: 100%">
          <el-table-column prop="columnName" :label="$t('genCode.column.columnName')"></el-table-column>
          <el-table-column prop="columnClassName" :label="$t('genCode.column.columnClassName')"></el-table-column>
          <el-table-column prop="remarks" :label="$t('genCode.column.remarks')"></el-table-column>
        </el-table>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>

<script>
  import Vue from 'vue'
  import { vsprintf } from 'sprintf-js/dist/sprintf.min.js'
  import { regionData, CodeToText } from 'element-china-area-data'
  import { updateToSubmit } from '@/utils/utils'
  import { fetchQuery, fetchGet } from '@/api/restful'
  import { Loading } from 'element-ui'

  export default {
    data() {
      var form = JSON.parse(JSON.stringify(this.$parent.selectedRow));
      return {
        form: form
      };
    },
    methods: {
      onClose(){
        this.$router.push("/");
      }
    },
    mounted(){
      let loading = Loading.service({ target: this.$el.childNodes[0] });
      fetchGet('/genCode/'+this.$parent.selectedRow.tableName).then(response => {
        if(response.data.success){
          var table = response.data.result;
          for(var key in table){
            this.form[key] = table[key];
          }
        }
        loading.close();
      }).catch(() => {
        loading.close();
      });
    }
  };
</script>
